      <!-- navbar header -->
      <div  ng-init="init()" class="navbar-header {{app.settings.navbarHeaderColor}}">
        <button class="pull-right visible-xs dk" ui-toggle-class="show" data-target=".navbar-collapse">
          <i class="glyphicon glyphicon-cog"></i>
        </button>
        <button class="pull-right visible-xs" ui-toggle-class="off-screen" data-target=".app-aside" ui-scroll="app">
          <i class="glyphicon glyphicon-align-justify"></i>
        </button>
        <!-- brand -->
        <li ng-repeat="menu in appConfig">
        <a href="" ng-click="getSecondMenu(menu.seqId);" class="navbar-brand text-lt">
          <i class="fa fa-home fa-fw c-fa"></i>
          <span class="hidden-folded m-l-xs">{{menu.name}}</span>
        </a>
        </li>
        <!-- / brand -->
      </div>
      <!-- / navbar header -->

      <!-- navbar collapse -->
      <div class="collapse pos-rlt navbar-collapse box-shadow {{app.settings.navbarCollapseColor}}">

        <!-- nabar right -->
        <ul class="nav navbar-nav navbar-right">

          <!--<li ng-repeat="menu in appConfig">-->
            <!--<a href="" ng-click="getSecondMenu(menu.seqId);" class="dropdown-toggle">-->
              <!--<i class="fa fa-home fa-fw c-fa"></i> {{menu.name}}-->
            <!--</a>-->
          <!--</li>-->

          <li class="dropdown hidden-sm" is-open="lang.isopen" dropdown>
            <!-- dropdown -->
            <ul class="dropdown-menu animated fadeInRight w">
              <li ng-repeat="(langKey, label) in langs">
                <a ng-click="setLang(langKey, $event)" href>{{label}}</a>
              </li>
            </ul>
            <!-- / dropdown -->
          </li>
          <li class="hidden-xs">
            <a ui-fullscreen></a>
          </li>
          <li class="dropdown" dropdown>
            <!--<a href class="dropdown-toggle" dropdown-toggle>-->
              <!--<i class="icon-bell fa-fw"></i>-->
              <!--<span class="visible-xs-inline">Notifications</span>-->
              <!--<span class="badge badge-sm up bg-danger pull-right-xs">2</span>-->
            <!--</a>-->
            <!-- dropdown -->
            <!--<div class="dropdown-menu w-xl animated fadeInUp">-->
              <!--<div class="panel bg-white">-->
                <!--<div class="panel-heading b-light bg-light">-->
                  <!--<strong>You have <span>2</span> notifications</strong>-->
                <!--</div>-->
                <!--<div class="list-group">-->
                  <!--<a href class="media list-group-item">-->
                    <!--<span class="pull-left thumb-sm">-->
                      <!--<img src="img/a0.jpg" alt="..." class="img-circle">-->
                    <!--</span>-->
                    <!--<span class="media-body block m-b-none">-->
                      <!--Use awesome animate.css<br>-->
                      <!--<small class="text-muted">10 minutes ago</small>-->
                    <!--</span>-->
                  <!--</a>-->
                  <!--<a href class="media list-group-item">-->
                    <!--<span class="media-body block m-b-none">-->
                      <!--1.0 initial released<br>-->
                      <!--<small class="text-muted">1 hour ago</small>-->
                    <!--</span>-->
                  <!--</a>-->
                <!--</div>-->
                <!--<div class="panel-footer text-sm">-->
                  <!--<a href class="pull-right"><i class="fa fa-cog"></i></a>-->
                  <!--<a href="#notes" data-toggle="class:show animated fadeInRight">See all the notifications</a>-->
                <!--</div>-->
              <!--</div>-->
            <!--</div>-->
            <!-- / dropdown -->
          </li>
          <li class="dropdown" dropdown>
            <!--<a href class="dropdown-toggle clear" dropdown-toggle>-->
              <!--<span class="thumb-sm avatar pull-right m-t-n-sm m-b-n-sm m-l-sm">-->
                <!--<img src="img/a0.jpg" alt="...">-->
                <!--<i class="on md b-white bottom"></i>-->
              <!--</span>-->
              <!--<span class="hidden-sm hidden-md">John.Smith</span> <b class="caret"></b>-->
            <!--</a>-->
            <!-- dropdown -->
            <ul class="dropdown-menu animated fadeInRight w">
              <li class="wrapper b-b m-b-sm bg-light m-t-n-xs">
                <div>
                  <p>300mb of 500mb used</p>
                </div>
                <progressbar value="60" class="progress-xs m-b-none bg-white"></progressbar>
              </li>
              <li>
                <a href>
                  <span class="badge bg-danger pull-right">30%</span>
                  <span>Settings</span>
                </a>
              </li>
              <li>
                <a ui-sref="app.page.profile">Profile</a>
              </li>
              <li>
                <a ui-sref="app.docs">
                  <span class="label bg-info pull-right">new</span>
                  Help
                </a>
              </li>
              <li class="divider"></li>
              <li>
                <a ui-sref="access.signin">Logout</a>
              </li>
            </ul>
            <!-- / dropdown -->
          </li>
        </ul>
        <!-- / navbar right -->

      </div>
      <!-- / navbar collapse -->
